<?php if (!defined('THINK_PATH')) exit();?><!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="http://api.chinaola.net/ola/Application/Test/Public/css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="http://api.chinaola.net/ola/Application/Test/Public/css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="http://api.chinaola.net/ola/Application/Test/Public/css/base.css"/>
    <style type="text/css">
        li{list-style:none;}
        /* new */
        #headurl {
            width:80px;
            max-width: 80px;
            height: 80px;
            border-radius:100%;
        }
        .body_one{
            height:80px;
        }
        #name {
            font-size: 22px;
            color: #000;
            /*height: 30px;*/
            line-height: 30px;
            margin:0;
        }
        .tiezi_title {
            line-height: 17px;
            height:17px;
        }
        .tiezi_title p {
            float: left;
            display: inline-block;
            margin-right: 10px;
        }
        .tiezi_title:after {
            content: '';
            display: block;
            clear: both;
        }
        .i_list {
            background: #FFFFFF;
        }
        .i_list>div {
            height: 38px;
            line-height: 38px;
            text-indent: 80px;
            position: relative;
            font-size: 13px;
        }
        .list_text>span:nth-child(1){
            position: absolute;
            left: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
            display: block;
            text-indent: 15px;
            color: #039fff;
        }
        .list_text .weixin{
            color: #039fff;
        }
        .list_text:after{
            content: '';
            position: absolute;
            display: block;
            left: 0;
            bottom: 0;
            text-indent: 0;
            width: 92%;
            margin: auto 4%;
            height: 1px;
            background: #cccccc;
        }
        .list_text:nth-last-child(1):after{
            display:none;
        }

        #order{
            position: fixed;
            bottom:0;
            left:0;
            display:block;
            width:100%;
            height:50px;
            line-height:50px;
            z-index:999;
            padding:0;
            background: #6bb4ff;
            border:none;
            color:#fff;
        }

        #list {
            margin-top: 10px;
            margin-bottom:50px;
            background: #FFFFFF;
        }

        .mui-card {
            box-shadow: 0 1px 2px rgba(0,0,0,0);
            margin: 0 auto 10px;
        }
        #tblist li {
            padding: 15px 15px 10px;
        }
        #listheadurl {
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            border-radius: 100%;
            line-height: 42px;
            max-width: 42px;
            height: 42px;
            width: 42px;
        }
        #listwriter {
            margin-top: 0;
            font-size: 12px;
            color: #000;
            height:12px;
            line-height:12px;
        }
        .mui_body_img {
            width: 100%;
            display: -moz-box;
            display: -webkit-box;
        }

        .mui_body_img img{
            display:block;
            -webkit-box-flex: 1;
            -moz-box-flex: 1;
            -ms-box-flex: 1;
            box-flex: 1;
            height:26vw;
            border:2px solid #FFFFFF;
        }
        .people{
            padding:10px 0 10px 80px;
        }
        .people ul:before{
            display: block;
            content: '';
            clear:both;
        }
        .people ul{
            margin-top:0;
            position: relative;
            overflow: hidden;
            height:80px;
        }
        .people img{
            width: 35px;
            height: 35px;
            border-radius:100%;
            margin: 0 auto;
            display: block;
        }
        .people li{
            display:inline-block;
            margin-right:10px;
            font-size:12px;
            position: absolute;
        }
        .people span{
            display: block;
            text-indent: 10px;
        }
        .title_span{
            padding:0 10px;
            font-size:12px;
            height:26px;
            line-height:26px;
            color:#fff;
            -webkit-border-radius:20px;
            -moz-border-radius:20px;
            border-radius:20px;
            background: #039fff;
            display:inline-block;
            text-indent: 0;
            text-align: center;
            margin-left:2px;
        }
        .info span{
            margin-left:8px;
        }
        .info li p:nth-child(2){
            color:#000000;
            font-size: 12px;
        }
        .list_text>div{
            display:inline-block;
            text-indent:0;
        }
        .hugong_top_info{
            /*float:left;*/
            margin-right:15px;
        }
        .hugong_focus{
            margin-top:2px;
            padding:2px 30px;
            display:inline-block;
            border:1px solid #ccc;
            font-size:13px;
        }
        .hugong_focus:active{
            background: #6bb4ff;
            color:#fff;
            border-color:#fff;
        }
        .focused{
            background: #6bb4ff;
            color:#fff;
            border-color:#fff;
        }
        #phone{
            text-indent:-30px;
            text-decoration:underline;
        }
        #weixin{
            text-indent:4px;
        }
        .hugong_diqu{
            margin:0;
            font-size:13px;
        }
        .hank-table-view-cell{
            position: relative;
            z-index:999;
            overflow: hidden;
            padding: 11px 15px;
        }
        #jubao{
            padding-left:15px;
            padding-right: 10px;
        }
        .jianjie {
            padding:10px;
        }
        .jianjie p {
            font-size: 12px;
            margin-bottom:0;
            text-indent:10px;
        }
    </style>
</head>
<body>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
    <button id="order" type="button" class="mui-btn mui-btn-warning mui-btn-outlined">立即预约</button>
    <div class="mui-scroll">
        <div class="mui-content">
            <div id="head">
                <ul class="mui-table-view">
                    <li class="hank-table-view-cell mui-media">
                        <img id="headurl" class="mui-media-object mui-pull-left" src="./images/60x60.gif">

                        <div class="mui-media-body body_one">
                            <p id="name"></p>

                            <div class="hugong_top_info hugong_diqu">服务地区:<span class="location_diqu"></span></div>
                            <div class="hugong_top_info hugong_focus" id="focus">关注</div>
                        </div>
                    </li>
                </ul>
                <div class="i_list">
                    <div class="list_text"><span>基本信息</span> <span id="hugong_sex"></span>&nbsp;|&nbsp;<span id="hugong_age"></span></div>
                    <div class="list_text"><span style="text-align:center;">电话:</span><div id="phone"></div>&nbsp;&nbsp;&nbsp;&nbsp;<span class="weixin">微信:</span><div id="weixin"></div></div>
                    <div class="list_text">
                        <span class="mui-pull-left">技能标签</span>
                        <div id="skill">
                        </div>
                    </div>
                </div>

                <div id="list">
                    <div class="mui-col-sm-12 mui-col-xs-12">
                        <div class="mui-card-header" style="display: block;">
                            <span class="mui-pull-left" style="color: #039fff;font-size:16px;">个人简介</span>
                        </div>
                        <div class="jianjie">
                            <p>您好！</p>
                            <p>我来自中风医馆。预约我！您将享受我们全面的护理服务。</p>
                        </div>
                    </div>
                    <div class="info">
                    </div>
                </div>
            </div>
        </div>
    </div>


</div>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/mui.min.js"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/common.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/storage.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/server.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/findtiebalist.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
            down: {
                callback: pulldownRefresh
            },
            up: {
                contentrefresh: '正在加载...',
                callback: pullupRefresh
            }
        }
    });

    var token = lget('token');

    //获取地址栏信息
    function GetQueryString(name)
    {
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }

        //预约服务
        $("#order").click(function() {
            location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=io.dcloud.Stroke_hospital';
        });

        mui.ajax(showCommunityDetail, {
            data: {
                "fakeid": GetQueryString('fakeid')
            },
            dataType: 'json', //服务器返回json格式数据
            type: 'post', //HTTP请求类型
            timeout: 10000, //超时时间设置为10秒；
            success: function(data) {
                console.log(JSON.stringify(data));
                $("#fans").text(data.fans);
                $("#name").text(data.name);
                $("#hugong_sex").text(data.sex);
                $("#hugong_age").text(data.age);
                $("#phone").text(data.phone);
                $("#weixin").text(data.wechat);
                var location_diqu='';
                for(var xl = 0;xl<data.server_adress.length;xl++){
                    location_diqu += data.server_adress[xl]+' ';
                }
                $(".location_diqu").text(location_diqu);

                //标签
                var ajax_skill;
                var num_skill = data.skill.split(',').length;
                var text_skill;
                for(var x = 1;x<=num_skill;x++){
                    ajax_skill = data.skill.split(',')[x-1];
                    text_skill = '<div class="title_span">'+ajax_skill+'</div>';
                    $("#skill").append(text_skill);
                }
                $('#headurl').attr("src", data.headurl);
                $('#addr').text(data.place);

                if(data.flag == 0) {
                    $('#focus').removeClass('focused').text("关注");
                } else if(data.flag == 1) {
                    $('#focus').addClass('focused').text("已关注");
                } else {
                    alert(error)
                }
            },
            error: function(xhr, type, errorThrown) {
                mui.toast("网络连接失败")
            }
        });

//    });

    //点击关注
    $("#focus").click(function() {
        location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=io.dcloud.Stroke_hospital';
    });

    /**
     * 下拉刷新具体业务实现
     */
    function pulldownRefresh() {
        setTimeout(function() {
            location.reload();
            mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
        }, 1500);
    }
    var count = 0;
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {
        setTimeout(function() {
            mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
        }, 1500);
    }
</script>
</body>

</html>